﻿@{
    ViewData["Title"] = "NewsEdit";
    Layout = "~/Views/Shared/_ManageLayout.cshtml";
    var Id = ViewData["Id"] as int?;
    var classTypes = new Dictionary<string, object>();
    classTypes.Add("classType", (int)ClassType.News);
}
@section css{
    <style>
        .layui-form-item .layui-inline {
            margin-bottom: 15px !important;
        }
    </style>
}
<!-- 加载动画 -->
<div class="page-loading">
    <div class="ball-loader">
        <span></span><span></span><span></span><span></span>
    </div>
</div>
<!-- 正文开始 -->
<form class="layui-form" id="formAdvForm" lay-filter="formAdvForm">
    <input name="id" type="hidden" value="@Id" />
    <div class="layui-fluid" style="padding-bottom: 75px;">
        <div class="layui-card">
            <div class="layui-card-header">新闻信息</div>
            <div class="layui-card-body">
                <div class="layui-form-item layui-row">
                    <div class="layui-inline layui-col-md5">
                        <label class="layui-form-label layui-form-required">所在栏目:</label>
                        <div class="layui-input-block">
                            <input type="text" id="classTree" name="classTree" lay-filter="classTree" class="layui-input" readonly="readonly">
                        </div>
                    </div>
                    <input type="hidden" id="classId" name="classId">
                    <input type="hidden" id="languageId" name="languageId">
                    <div class="layui-inline layui-col-md5">
                        <label class="layui-form-label layui-form-required">标题:</label>
                        <div class="layui-input-block">
                            <input name="title" placeholder="请输入标题" class="layui-input" />
                        </div>
                    </div>
                    <div class="layui-inline layui-col-md5">
                        <label class="layui-form-label layui-form-required">SeoKeywords:</label>
                        <div class="layui-input-block">
                            <input name="seoKeywords" placeholder="请输入SeoDescritions" class="layui-input" />
                        </div>
                    </div>
                    <div class="layui-inline layui-col-md5">
                        <label class="layui-form-label layui-form-required">Seo描述:</label>
                        <div class="layui-input-block">
                            <input name="seoDescription" placeholder="请输入Seo描述" class="layui-input" />
                        </div>
                    </div>
                    <div class="layui-inline layui-col-md5">
                        <label class="layui-form-label layui-form-required">是否显示:</label>
                        <div class="layui-input-block">
                            <input type="checkbox" name="isShowCheck" lay-skin="switch" lay-text="是|否">
                        </div>
                    </div>
                    <div class="layui-inline layui-col-md5">
                        <label class="layui-form-label layui-form-required">排序(越大越靠前):</label>
                        <div class="layui-input-block">
                            <input name="sort" placeholder="请输入排序" type="number" class="layui-input" />
                        </div>
                    </div>
                    <div class="layui-inline layui-col-md5">
                        <label class="layui-form-label layui-form-required">标题图片:</label>
                        <div class="layui-upload-drag" id="uploadImg">
                            <i class="layui-icon"></i>
                            <p>点击上传，或将文件拖拽到此处</p>
                            <div class="layui-hide" id="uploadDemoView">
                                <hr>
                                <img src="" alt="上传成功后渲染" style="max-height: 120px; max-height: 120px">
                            </div>
                        </div>
                        <input name="titleImg" type="hidden">
                    </div>
                </div>

            </div>
        </div>
        <div class="layui-card">
            <div class="layui-card-header">新闻内容</div>
            <div class="layui-form-item layui-row">
                <div class="layui-inline layui-col-md12">
                    <label class="layui-form-label layui-form-required">新闻内容:</label>
                    <div class="layui-input-block">
                        <textarea id="content" name="content" placeholder="请输入新闻内容" class="layui-textarea"
                                  lay-verType="tips"></textarea>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <div class="form-group-bottom text-right">
        <button type="reset" class="layui-btn layui-btn-primary">&emsp;重置&emsp;</button>
        <a class="layui-btn" lay-filter="formAdvSubmit" lay-submit>&emsp;保存&emsp;</a>
    </div>

</form>
<script type="text/javascript">
    layui.use(['admin', 'layer', 'form', 'table', 'laydate', 'upload', 'CKEDITOR','treeSelect'], function () {
        var $ = layui.jquery;
        var admin = layui.admin;
        var layer = layui.layer;
        var form = layui.form;
        var table = layui.table;
        var laydate = layui.laydate;
        var CKEDITOR = layui.CKEDITOR;
        var Id = $("[name=id]").val();
        var treeSelect = layui.treeSelect;
        var index2 = parent.layer.getFrameIndex(window.name);
        var upload = layui.upload;
        CKEDITOR.replace('content', { height: 480 });
        var insEdt = CKEDITOR.instances.content;
        treeSelect.render({
            elem: '#classTree',// 选择器
            data: '/api/ContentClass/GetContentTreeList',// 数据接口
            placeholder: '请选择上级类型', // 数据
            search: false,// 是否开启搜索功能：true/false，默认false
            style: { // 一些可定制的样式
                folder: {
                    enable: true
                },
                line: {
                    enable: true
                }
            },
            click: function (d) {
                if (d.current.isLanguage) {
                    $("#classId").val(0);
                } else {
                    $("#classId").val(d.current.id);
                }
                $("#languageId").val(d.current.languageId);
            },
            success: function (d) {
                //加载完成后的回调函数
                if (Id != "0") {
                    LoadNews();
                }
            }
        });
        //拖拽上传
        upload.render({
            elem: '#uploadImg'
            , url: '/api/upload/manageUpload'
            , size:@(AppSetting.MaxFile * 1024)
            , done: function (res) {
                if (res.success) {
                    layer.msg(res.message, { icon: 1 });
                    $('#uploadDemoView').removeClass('layui-hide').find('img').attr('src', res.data.src);
                    $("[name=titleImg]").val(res.data.src);
                } else {
                    layer.msg(res.message, { icon: 2 });
                }
            }
        });
        /* 监听表单提交 */
        form.on('submit(formAdvSubmit)', function (data) {
            var FromData = data.field;
            var content = insEdt.getData();
            if (FromData.isShowCheck) {
                if (FromData.isShowCheck == "on") {
                    FromData.isShow = 1;
                } else {
                    FromData.isShow = 0;
                }
            } else {
                FromData.isShow = 0;
            }
            var field = Object.assign(FromData, { content: content });
            var url = Id == "0" ? "/api/newsInfo" : "/api/newsInfo/" + field.id;
            var typestr = Id == "0" ? "post":"put"
            layer.confirm('确认要保存吗?', { btn: ['确定', '取消'] }
                , function (index) {
                    layer.load(2);
                    $.ajax({
                        url: url,
                        type: typestr,
                        data: JSON.stringify(field),
                        contentType: "application/json",
                        dataType: "json",
                        complete: function (obj) {
                            layer.closeAll('loading');
                        },
                        success: function (result) {
                            if (result.success) {
                                layer.msg(result.message, { icon: 1, time: 1200 }, function () {
                                    if (Id != "0") {
                                        window.location.reload();
                                    } else {
                                        window.location.href = "/manage/NewsEdit?Id=" + result.data;
                                    }
                                });
                            } else {
                                layer.msg(result.message, { icon: 2 });
                            }
                        }
                    });
                });
        });

        function LoadNews() {
            $.ajax({
                url: '/api/newsInfo/' + Id,
                type: 'get',
                contentType: "application/json",
                dataType: "json",
                async: false,
                success: function (res) {
                    if (res.success) {
                        form.val('formAdvForm', res.data);
                        form.render('select');
                        // 获取zTree对象，可以调用zTree方法
                        if (res.data.parentId != 0) {
                            treeSelect.checkNode('classTree', res.data.classId);
                        } else {
                            treeSelect.checkNode('classTree', "Language_" + res.data.languageId);
                        }
                        if (res.data.titleImg != null && res.data.titleImg != '') {
                            $('#uploadDemoView').removeClass('layui-hide').find('img').attr('src', res.data.titleImg);
                            $("[name=titleImg]").val(res.data.titleImg);
                        }
                        if (res.data.isShow == 1) {
                            $("[name=isShowCheck]").prop("checked", true);
                            form.render('checkbox');
                        }
                    }
                }
            })
        }
    });
</script>

